<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    .box{
      display: flex;
      justify-content: stretch;
    }
    .b-lf{
      flex: 1;      
    }
    .b-rg{
      flex: 1;
      min-height: 300px;
      max-height: 700px;
      overflow: auto;
      background-color: beige;
      list-style: none;
      margin: 0;
      padding: 0;
    }
  </style>
  <script src="https://lib.baomitu.com/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
  <div class="box">
    <div class="b-lf">
      <input type="text" class="txt">
      <button>提交</button>
    </div>
    <ul class="b-rg">
    </ul>
  </div>
  <script>
    let getData = () => {
      $.ajax({
        method: 'get',
        url: '/msg',
        success(res){
          console.log(res);
          // let html = '';
          // res.map(item => {
          //   html += `<li>${item.msg}</li>`
          // })
          // $('.b-rg').html(html);
        }
      })
    }

    window.onload = function(){
      setInterval(function(){
        getData()
      }, 1000);
    }
  </script>
</body>
</html>